.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}
html, body{
    height: 100%;
}
body{
    display: flex;
    flex-direction: column;
}
.head{
    display: flex;
    .px2rem(height, 90);
    .px2rem(line-height, 90);
    text-align: center;
    background: #7e4c81;
    color: white;  
    .left{
        width: 15%;
        display: flex;
        justify-content: center;
        align-items: center;
        img{
            width: 40%;
            .px2rem(height, 50);
        }
    }
    .center{
        flex: 1; 
        .px2rem(font-size, 30);
    }
    .right{
        width: 15%;  
    }
}
.content {
    flex: 1;
    overflow: auto;
    .nav {
         .px2rem(height, 89);
         border:1px solid #ccc;
        ul {
            display: flex;
            li {
                border-right: 1px solid #7e4c81;                
                flex:1;
                text-align: center;
                .px2rem(line-height, 89);           
                .px2rem(font-size, 30);

            }
            li:nth-child(3) {
              border-right: none;
            }
        }
    }
    .main {
        border:1px solid #ccc;
        width: 95%;
        .px2rem(height, 650);
         margin:16px auto;
         border-radius: 10px;
         ul {
            li {
                display: flex;
                // justify-content:center;
                align-items:center;
                .px2rem(font-size, 33);
                font-weight: bold;
                border-bottom: 1px solid #ccc;
                p {
                    width: 32%;
                    .px2rem(height, 83);
                    display: flex;
                    align-items:center;
                    justify-content:center;
                }
                div {
                    width: 68%;
                }
            }
            li:nth-child(7) {
                .px2rem(height,163);
                .px2rem(line-height,63);
            }
            li:nth-child(odd) {
                background: #e9ecf1;
            } 
            li:nth-child(even) {
                background: #f3f3f3;
            }
         }
    }
    .footer{
        .px2rem(height, 230);
        img {
        width: 95%;
        margin-top: 40px;
        margin-left:34px;
        } 
    }
}
